<template>
  <div>
    <a-modal v-model="visible" :width="820" title="WiFi添加" @ok="handleOk">
      <a-form class="lab_l form_l">
        <a-form-item label="WiFi名称" :label-col="{ span: 3 }" :wrapper-col="{ span: 16 }">
          <a-input v-model="obj.name" placeholder="请输入" />
        </a-form-item>
        <!-- BASSID -->
        <a-form-item label="BSSID" :label-col="{ span: 3 }" :wrapper-col="{ span: 16 }">
          <a-input v-model="obj.macAddr" placeholder="请输入" />
        </a-form-item>
        <a-form-item label="获取方式" />
        <a-row>1.可以向公司IT部门询问公司WiFi的BSSID </a-row>
        <!-- <a-row>2.也可以通过使用最新版企业微信扫描右侧二维码获取 </a-row> -->
        <a-row>2.请确保路由器BSSID不会动态变化，否则在连接Wi-Fi后可能出现“不在打卡范围内”等异常</a-row>
        <div style="height:100px" />
      </a-form>
    </a-modal>
  </div>
</template>

<script>
export default {
  props: {
    wifiOptions: {
      type: Object,
      default: () => ({
        show: false,
        obj: {}
      })
    }
  },
  data() {
    return {
      visible: false,
      obj: {
        macAddr: "",
        name: ""
      }
    };
  },

  watch: {
    wifiOptions: {
      handler(val) {
        this.obj = val.obj;
        this.visible = val.show;
      }
    }
  },

  methods: {
    /* 添加wifi */
    handleOk() {
      this.visible = false;
      this.$emit("editorWifi", this.obj);
    }
  }
};
</script>
<style lang="scss" scoped>
.form_l {
  margin-left: 150px;
}
</style>
